<template>
	<div class="container" style="margin-bottom: 0px;">
		<div class="index-header">
			<img src="../assets/images/logoB.png" v-if="logoFlag">
			<img :src="logoUrl" v-if="!logoFlag">
			<div class="sliderBtn" @click="dialogBtn" v-show="bcidFlag">
				<img src="../assets/images/slidBtn.png">
			</div>
		</div>
		<router-link class="project-active" to="/modifyProject" v-show="bcidFlag">
				{{premisesName}}
			<i class="fa fa-angle-right"></i>
		</router-link>
		<div class="information-number">
			<ul class="info-list">
				<router-link tag="li" :to="{path:'/confirmList'}">
					<p class="title">待确认</p>
					<p class="number">{{homePageInfo.auditCount}}</p>
				</router-link>
				<router-link tag="li" :to="{path:'/distList'}">
					<p class="title">已到访</p>
					<p class="number">{{homePageInfo.distCount}}</p>
				</router-link>
				<router-link tag="li" :to="{path:'/complaintHandling'}">
					<p class="title">申诉处理</p>
					<p class="number">{{homePageInfo.appealCount}}</p>
				</router-link>
			</ul>
		</div>
		<div class="searchDiv">
			<div class="input-wrap">
				<p class="input-text" @click="clickDiv"><i class="fa fa-search" v-show="bcidFlag"></i>请输入完整的客户姓名或电话</p>
			</div>
		</div>

		<ul class="entry-list">
			<li  v-show="bcidFlag" style="width: 100%;">
				<router-link to="/report" class="entryBtn">
					<div class="entryBtn-icon">
						<span></span>
					</div>
				</router-link>
				<p class="entry-title">代报备</p>
			</li>
			<!--li @click="startRecognize" v-show="bcidFlag">
				<a href="javascript:;" class="entryBtn">
					<div class="entryBtn-icon">
						<span class="icon-two"></span>
					</div>
				</a>
				<p class="entry-title" >扫码确认</p>
			</li-->
		</ul>

		<search-page v-if="thisShow" msgFrom = "thisShow" v-on:cancel-search = "cancelSearch"></search-page>
		<transition name="slipLeft">
	      	<div class="sidebar" v-if="showDialog">
	      		<div class="logo-name">
	      			<div class="logoV" v-if="exitLogo"></div>
	      			<div class="logoV" v-if="!exitLogo"v-bind:style="{'background': 'url('+exitLogoUrl+')'}"></div>
	      			<p class="userName">{{userName}}</p>
	      		</div>
	  			<ul class="sidebar-list">
	  				<router-link tag="li" to="/modifyPassword">
	  					<i class="fa fa-lock leftIcon"></i>
	  					修改密码
	  					<i class="fa fa-angle-right rightIcon"></i>
	  				</router-link>
	  				<!--
                      	作者：353895897@qq.com
                      	时间：2017-04-24
                      	描述：此功能已经移动至首页
	  				<router-link tag="li" to="/modifyProject">
	  					<i class="fa fa-folder-open leftIcon"></i>
	  					修改项目
	  					<i class="fa fa-angle-right rightIcon"></i>
	  				</router-link>
	  				-->
	  			</ul>
	  			<a href="javascript:;" class="sign-out" @click="signOut">退出</a>
	      	</div>
      	</transition>
      	<div class="dialog-cover" @click="closeDialog" v-if="showDialog"></div>
	</div>
</template>
<script>
    import SearchPage from './base/searchPage.vue'
    import { Toast } from 'mint-ui'
    var wx=require('weixin-js-sdk')
	export default {
		components:{
			SearchPage
		},
		data () {
		    return {
		      exitLogo:true,
		   	  logoFlag:true,
		      thisShow: false,
		      showDialog: false,
		      homePageInfo: {},
		      bcidFlag:true,
		      logoUrl:'',
		      exitLogoUrl:'',
		      userId: window.sessionStorage.getItem(this.utilHelper.appAssistant+"_userId"),
		      userName: window.sessionStorage.getItem(this.utilHelper.appAssistant+"_userName"),
		      premisesId: window.sessionStorage.getItem(this.utilHelper.appAssistant+"_premisesId"),
		      premisesName: window.sessionStorage.getItem(this.utilHelper.appAssistant+"_premisesName")
		    }
		},
		mounted: function() {
			this.initHomePage();
	       	this.wxConfig();
	       	this.getCompanyLogo();
	       	if(!this.premisesName){
				this.premisesName = "切换项目";
	       	}
		},
		methods :{
			/*onPlusReady(){
			    var e = document.getElementById("scan");
			    e.removeAttribute( "disabled" );
			},*/
			bcidBack(){
				scan.close();
				this.bcidFlag =true;
			},
			onmarked( type, result,file ){
				scan.close();
				this.bcidFlag =true;
				this.$router.replace({
					path: '/customerDetails/'+result
				})
			},
			onerror(error){
				console.log(error);
			},
			startRecognize() {
				//摄像头权限判断
				/*if('denied' == plus.navigator.checkPermission('CAMERA')){
                    Toast("未获取摄像头权限，请设置");
                    return;
				}
				this.bcidFlag = false;
				scan = new plus.barcode.Barcode('bcid');
				scan.onmarked = this.onmarked;
				scan.onerror = this.onerror;
				this.startScan();
				*/
				this.$router.push({path:'/barcodeScan'});
			},
			startScan() {
				scan.start();
			},
			getCompanyLogo(){
				var _self=this;
				var url = _self.utilHelper.apiUrl + "/api/getLogo";
				var body = {};
				body.params = {'logoType':'3'}
				_self.$http.post(url,body).then((response) =>{
					var data = response.body.resData;
					if(data.result=='1'){
						_self.logoUrl = data.logoUrl;
						_self.logoFlag=false;
					}
				})
			},
			getExitLogo(){
				var _self=this;
				var url = _self.utilHelper.apiUrl + "/api/getLogo";
				var body = {};
				body.params = {'logoType':'4'}
				_self.$http.post(url,body).then((response) =>{
					var data = response.body.resData;
					if(data.result=='1'){
						_self.exitLogoUrl = data.logoUrl;
						_self.exitLogo = false;
					}
				})
			},
			wxConfig(){
                //微信配置
                var currUrl=location.href.split('#')[0];
                var body = {};
                body.params={
                	url:currUrl
                };
                var url = this.utilHelper.apiUrl+'/api/js_ticket';
                this.$http.post(url,body).then((response)=>{
                    var data = response.body.resData;
                    wx.config({
                          debug: false,
                          appId: data.appid, // 必填，公众号的唯一标识
                          timestamp: data.time, // 必填，生成签名的时间戳
                          nonceStr: data.noncestr, // 必填，生成签名的随机串
                          signature: data.signature,// 必填，签名，见附录1
                          jsApiList: ['scanQRCode']
                    });
                });
            },
            scanQRCode:function(){
                //微信扫码
                var _self = this;
                wx.scanQRCode({
				    needResult: 1, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
				    scanType: ["qrCode","barCode"], // 可以指定扫二维码还是一维码，默认二者都有
				    success: function (res) {
				       	var result = res.resultStr; // 当needResult 为 1 时，扫码返回的结果
						_self.$router.replace({
							path: '/customerDetails/'+result
						})
                    }
               });
            },
			clickDiv() {
				this.thisShow = true;
			},
			cancelSearch(msg) {
				this.thisShow = msg;
			},
			dialogBtn(){
				this.getExitLogo();
				this.showDialog = true;
			},
			closeDialog () {
		      this.showDialog = false;
		   	},
		   	initHomePage(){
		   		var _self = this;
		   		var body = {};
				body.params = {
					premisesId: _self.premisesId
				}
				var url = _self.utilHelper.apiUrl+'/api/getAssistantAppIndex';
				_self.$http.post(url, body).then((response)=>{
					var data = response.body.resData;
					var result = data.result;
					var errorMsg = data.resultMsg;
                    const appAssistant = _self.utilHelper.appAssistant;
					if(result==1){
						_self.homePageInfo = data;
					}else{
						if(errorMsg){
							Toast({
							  	message: errorMsg,
							  	position: 'middle',
							  	duration: 2000
							});
						}
						window.sessionStorage.setItem(appAssistant+"_isLogin", false);
						_self.$router.replace({
							path: '/login'
						})
					}
				});
		   	},
		   	signOut() {
				var _self = this;
				var body = {};
                const appAssistant = _self.utilHelper.appAssistant;
                var params = {
                    userId: window.sessionStorage.getItem(appAssistant+"_userId"),
                    loginType:'2'
                }
				body.params = params;
				var url = _self.utilHelper.apiUrl + "/api/loginOut";
				_self.$http.post(url, body).then((response) => {
					var data = response.body;
					window.sessionStorage.setItem(appAssistant+"_isLogin",false);
                    window.sessionStorage.removeItem(appAssistant+"_userId");
                    window.sessionStorage.removeItem(appAssistant+"_userName");
                    window.sessionStorage.removeItem(appAssistant+"_phone");
                    window.sessionStorage.removeItem(appAssistant+"_premisesId");
					window.sessionStorage.removeItem(appAssistant+"_premisesName");
					
					_self.$router.replace({
						path: '/login'
					})
				}, (response) => {});
		   	},
			scanPicture(){
                var _self = this;
                //todo 摄像头权限判断
				plus.gallery.pick(function(path){
					plus.barcode.scan(path,_self.onmarked,function(error){
						plus.nativeUI.alert('无法识别此图片');
					});
				}, function(err){
				    Toast(err.message);
					console.log('Failed: '+err.message);
				});
  			  }
		}
	}
</script>
<style scoped>
	.index-header{background: url(../assets/images/bgIndex.png) no-repeat bottom center;height: 200px;background-size: 100% 114px;text-align: center;position: relative;}
	.index-header>img{width: 100px;height: 66px;margin-top: 88px;}
	.sliderBtn{position: absolute;left: 20px;top: 20px;width: 45px;height: 45px;overflow: hidden;display: block;}
	.sliderBtn img{width: 100%;height: 100%;}
	.information-number{padding: 28px 0;}
	.info-list li{float: left;width: 33.3%;text-align: center;border-right: 1px solid #d8d8d8;padding: 0 8px;display: flex;flex-direction: column;justify-content: space-between;height: 48px;}
	.info-list li:last-child{border-right: none;}
	.info-list li .title{font-size: 16px;color: #8d8d8d;line-height: 20px;}
	.info-list li .number{color: #333;font-weight: bold;line-height: 14px;font-size: 14px;}
	.info-list li>p{width: 100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
	.searchDiv{height: 55px;background-color: #f8f5f3;padding: 10px;position: relative;}
	.searchDiv .input-wrap{width: 100%;height: 35px;border-radius: 40px;background-color: #e1c7c7;}
	.input-wrap .input-text{color: #fff;display: block;line-height: 35px;text-align: center;}
	.input-wrap .input-text .fa{margin-right: 10px;font-size: 18px;}

	.entry-list{margin-top: 26px;padding-bottom: 30px;}
	.entry-list li{float: left;width: 50%;text-align: center;}
	.entryBtn{width: 78px;height: 78px;border-radius: 80px;margin: 0 auto 15px;padding-top: 6px;display: block;}
	.entryBtn:focus{background-color: #fdefe5;}

	.entryBtn .entryBtn-icon{width: 66px;height: 66px;border-radius: 66px;background-color: #ef7d2e;margin: 0 auto;padding-top: 22px;}
	.entryBtn-icon span{width: 23px;height: 23px;display: block;background: url(../assets/images/iconA.png) no-repeat;background-position: 0 0;margin: 0 auto;background-size: 23px auto;}
	.entryBtn-icon .icon-two{background-position: 0 -23px;}
	.entryBtn-icon .icon-three{background-position: 0 -46px;}
	.entry-list .entry-title{color: #000;font-size: 16px;}

	.project-active{background-color: #fdefe5;height: 44px;line-height: 44px;padding: 0 30px 0 10px;position: relative;display: block;
white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
	.project-active .fa{position: absolute;right: 10px;font-size: 20px;color: #ed8b41;top: 12px;}
	/*侧边栏*/
	.dialog-cover{position: fixed;left: 0;right: 0;top: 0;bottom: 0;}
	.dialog-cover{background: #000;opacity: .3;z-index:6; }
	.sidebar{position: fixed;left: 0;top: 0;bottom: 0; background-color: #fff;z-index: 66;width: 80%;padding-top: 220px;z-index:7;}
	.logo-name{position: absolute;top: 88px;left: 50%;text-align: center;margin-left: -50px;width: 100px;}
	.logo-name .logoV{width: 75px;height: 75px;border-radius: 100%;background: url(../assets/images/logoV.png) no-repeat center #eb6100;background-size: 54px auto;margin: 0 auto;}
	.logo-name .userName{color: #eb6100;font-size: 16px;padding-top: 16px;}
	.sidebar-list{padding-left: 10px;}
	.sidebar-list li{border-bottom: 1px solid #cdcdcd;padding: 8px 0;padding-left: 40px;line-height: 20px;height: 36px;position: relative;color: #333;margin-top: 8px;padding-right: 30px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;width: 100%;}
	.sidebar-list .leftIcon{position: absolute;left: 10px;color: #eb6100;top: 8px;font-size: 20px;}
	.sidebar-list .rightIcon{position: absolute;right: 10px;font-size: 20px;top: 7px;color: #cecece;}
	.sign-out{width: 168px;height: 36px;background-color: #fbe7dd;border:1px solid #fd893b;margin: 80px auto 0;display: block;text-align: center;line-height: 34px;border-radius: 60px;color: #6c2c00;font-size: 16px;}

	/*去浮动*/
	.info-list:after,.entry-list:after{content:''; display:block; clear:both; visibility: hidden; overflow: hidden; font-size:0; height:0;}
	.footer {
		width: 100%;
		height: 44px;
		position: fixed;
		bottom: 0px;
		line-height: 44px;
		text-align: center;
		color: #FFF;
	}
	.fbt {
		width: 50%;
		height: 100%;
		background-color: #eb6100;
		float: left;
	}
	#bcid {
		width: 100%;
		position: absolute;
		top: 0px;
		bottom: 85px;
		text-align: center;
		margin-bottom: 85px;
	}
	.tip {
		color: #FFFFFF;
		font-weight: bold;
		text-shadow: 0px -1px #103E5C;
	}
</style>
